<section class="container">
  <% is_proxy = BlockScoutWeb.AddressView.smart_contract_is_proxy?(@address) %>

  <%= render BlockScoutWeb.AddressView, "overview.html", address: @address, is_proxy: is_proxy, conn: @conn, exchange_rate: @exchange_rate, coin_balance_status: @coin_balance_status, counters_path: @counters_path, tags: @tags %>

  <section id="tokens">
    <div class="card">
      <%= render BlockScoutWeb.AddressView, "_tabs.html", address: @address, is_proxy: is_proxy, conn: @conn %>
      <div class="card-body" data-async-load data-async-listing="<%= @current_path %>">
        <%= render BlockScoutWeb.AddressTokenView,
          "overview.html",
          address: @address,
          exchange_rate: @exchange_rate
        %>

        <div class="list-top-pagination-container-wrapper">
          <%= render BlockScoutWeb.CommonComponentsView, "_pagination_container.html", position: "top", show_pagination_limit: true, data_next_page_button: true, data_prev_page_button: true %>
        </div>

        <div class="stakes-table-container">
            <table style="width: 100%;">
                <thead>
                    <tr>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">&nbsp;</div>
                        </th>
                        <th class="stakes-table-th">
                            <div>&nbsp;</div>
                        </th>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">Asset</div>
                        </th>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">Type</div>
                        </th>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">Amount</div>
                        </th>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">Symbol</div>
                        </th>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">Price</div>
                        </th>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">Value</div>
                        </th>
                        <th class="stakes-table-th">
                            <div class="stakes-table-th-content">Contract Address</div>
                        </th>
                    </tr>
                </thead>
                <tbody data-items data-selector="address-tokens-list">
                    <%= render BlockScoutWeb.CommonComponentsView, "_table-loader.html", columns_num: 9 %>
                </tbody>
            </table>
        </div>

        <button data-error-message class="alert alert-danger col-12 text-left" style="display: none;">
          <span href="#" class="alert-link"><%= gettext("Something went wrong, click to reload.") %></span>
        </button>

        <div data-empty-response-message style="display: none;">
          <div class="tile tile-muted text-center" data-selector="empty-token-list">
            <%= gettext "There are no tokens for this address." %>
          </div>
        </div>

        <%= render BlockScoutWeb.CommonComponentsView, "_pagination_container.html", position: "bottom", cur_page_number: "1", show_pagination_limit: true, data_next_page_button: true, data_prev_page_button: true %>

      </div>
    </div>
    <script defer data-cfasync="false" src="<%= static_path(@conn, "/js/address.js") %>"></script>
  </section>
</section>
